<!DOCTYPE html>
<html lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">
<head >
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <!-- Any Other things should follow these 3 meta above -->
    <title>商品列表页</title>
    <!-- Bootstrap -->
    <link href="../bootstrap/dist/css/bootstrap.css" rel="stylesheet"/>
    <link href="../css/common.css" rel="stylesheet"/>
    <link href="../css/product_list.css" rel="stylesheet"/>
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="../js/common/html5shiv.min.js"></script>
    <script src="../js/common/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!-- this is the common top begin -->
<div class="container-fluid">
    <div class="row top font-small">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            当前学校：<span>东南大学</span>
            <div class="float-right">
                <a href="#">买家登录</a>
                &nbsp;&nbsp;&nbsp;<a href="#">卖家登录</a>
                &nbsp;&nbsp;&nbsp;&nbsp;<a href="../buyer/buyer_register.html">买家注册</a>
                &nbsp;&nbsp;&nbsp;<a href="../seller/seller_register.html">卖家注册</a>
                &nbsp;&nbsp;&nbsp;&nbsp;<a href="#">我的订单</a>
            </div>
        </div>
        <div class="col-md-2">

        </div>
    </div>
    <div class="row banner">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <div class="row">
                <div class="col-md-3 logo">DaMi</div>
                <div class="col-md-5 font-bold">
                    <a class="active" href="../index.html">首页</a>
                    <a href="#">二手</a>
                    <a href="#">促销</a>
                    <a href="#">秒杀</a>
                </div>
                <div class="col-md-4">
                    <form class="form-inline">
                        <div class="form-group">
                            <input type="email" class="form-control search" name="search" id="exampleInputEmail3" placeholder="关键字">
                        </div>
                        <button type="submit" name="submit" class="btn btn-default">搜索</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="container">
        <div class="row clearfix font-small mt-10">
            <div class="col-md-3 column">
                <strong>商品分类</strong>
                <i class="mr-5 ml-5">></i>
            </div>
        </div>
    <div class="row mt-10 ul_area">
        <ul class="clearfix list-inline  ml-5 mr-5 mt-5 mb-5">
            <li><a href="#" title="女装">女装</a><span>（358.0万）</span></li>
            <li><a href="#" title="女装">女装</a><span>（358.0万）</span></li>
            <li><a href="#" title="女装">女装</a><span>（358.0万）</span></li>
            <li><a href="#" title="女装">女装</a><span>（358.0万）</span></li>
            <li><a href="#" title="女装">女装</a><span>（358.0万）</span></li>
            <li><a href="#" title="女装">女装</a><span>（358.0万）</span></li>
            <li><a href="#" title="女装">女装</a><span>（358.0万）</span></li>
        </ul>
    </div>
</div>
<div class="container mt-20 mb-10">
    <div class="row">
        <div class="col-md-4"> </div>
        <div class="col-md-3">
            <form th:action="@{/product_list.html}" method="post">
                <a th:href="@{/product_list.html}" class="border-one">最新发布</a>
                <span class="float-right">
                    <input type="text" name="min_price" style="height:20px; width: 20px"/>
                    <span> - </span>
                    <input type="text" name="max_price" style="height:20px; width: 20px"/>
                    <input type="submit" name="submit" class="btn-success" value="价格"/>
                </span>
            </form>
        </div>
        <div class="col-md-5 float-right">
            <form th:action="@{/product_list.html}" method="post">
                <input type="text" name="search" placeholder="请输入关键字或商品名"/>
                <input type="submit" name="submit" class="btn-primary" value="搜索"/>
            </form>
        </div>
    </div>
</div>
<div class="container">
    <div class="row">
        <div class="col-md-4 glyphicon-align-centert">
                <div class="btn-group float-right community_area">
                    <button type="button" class="btn btn-success dropdown-toggle btn-lg font-bold glyphicon glyphicon-list" data-toggle="dropdown"> 社团选择
                        <span class="caret"></span></button>
                    <ul class="dropdown-menu" role="menu">
                        <li>
                            <a href="#" class="glyphicon glyphicon-ok-sign">社团1</a>
                        </li>
                        <li>
                            <a href="#" class="glyphicon glyphicon-ok-sign">社团2</a>
                        </li>
                        <li>
                            <a href="#" class="glyphicon glyphicon-ok-sign">社团3</a>
                        </li>
                        <li>
                            <a href="#" class="glyphicon glyphicon-ok-sign">社团4</a>
                        </li>
                    </ul>
                </div>
        </div>
            <div class="col-md-8">
                <div class="row border-one product_list_area">
                    <div class="col-md-4">
                        <img src="#" alt="列表图片1" class="product_img mt-5 mb-5"/>
                    </div>
                    <div class="col-md-4">
                        <a href="#" >商品名称</a><br/>
                        <e>¥ <span class="font-red">100</span></e>
                        <p class="mt-10">商品描述</p>
                    </div>
                    <div class="col-md-4">
                        <a href="#" >卖家</a>
                    </div>
                </div>
                <div class="row border-one product_list_area">
                    <div class="col-md-4">
                        <img src="#" alt="列表图片1" class="product_img mt-5 mb-5"/>
                    </div>
                    <div class="col-md-4">
                        <a href="#" >商品名称</a><br/>
                        <e>¥ <span class="font-red">100</span></e>
                        <p class="mt-10">商品描述</p>
                    </div>
                    <div class="col-md-4">
                        <a href="#" >卖家</a>
                    </div>
                </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片1" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片1" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片2" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片3" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片4" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片5" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片6" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片7" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div><div class="row border-one product_list_area">
                <div class="col-md-4">
                    <img src="#" alt="列表图片8" class="product_img mt-5 mb-5"/>
                </div>
                <div class="col-md-4">
                    <a href="#" >商品名称</a><br/>
                    <e>¥ <span class="font-red">100</span></e>
                    <p class="mt-10">商品描述</p>
                </div>
                <div class="col-md-4">
                    <a href="#" >卖家</a>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 column text-center">
            <ul class="pagination">
                <li>
                    <a rel="nofollow" href="#">上一页</a>
                </li>
                <li>
                    <a rel="nofollow" href="#">1</a>
                </li>
                <li>
                    <a rel="nofollow" href="#">2</a>
                </li>
                <li>
                    <a rel="nofollow" href="#">3</a>
                </li>
                <li>
                    <a rel="nofollow" href="#">4</a>
                </li>
                <li>
                    <a rel="nofollow" href="#">5</a>
                </li>
                <li>
                    <a rel="nofollow" href="#">下一页</a>
                </li>
            </ul>
        </div>
    </div>
</div>

<!--This is the common footer Begin-->
<div class="container-fluid mt-20">
    <div class="row">
        <div class="col-md-12 footer-info">
            <div class="col-md-2 col-md-offset-3 mt-40 "><img src="../img/logo_button_1.jpg"/></div>
            <div class="col-md-3 mt-40 "><img src="../img/logo_button_2.jpg " /><br/><span class="font-grey" >一家专门做校园文化产品的网站</span></div>
            <div class="col-md-4 mt-60"><img class="qr-code"  src="../img/qr_code.png "/><br/><div class="mt-20 ">扫码有惊喜哦</div></div>
        </div>
    </div>
</div>

<div class="container">
    <div class="row mt-20 font-small">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <div id="footer">
                <div class="footerNav text-center">
                    <a href="#">关于我们</a> |
                    <a href="#">服务条款</a> |
                    <a href="#">免责声明</a> |
                    <a href="#">网站地图</a> |
                    <a href="#">联系我们</a>
                </div>
                <div class="copyRight text-center">
                    Copyright DaMi
                </div>
            </div>
        </div>
        <div class="col-md-2"></div>
    </div>
</div>


<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="../js/common/jquery-3.1.1.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="../bootstrap/dist/js/bootstrap.min.js"></script>
</body>
</html>
<!--This is the common footer End-->